<template>
  <div>
    <bread :second="'数据统计'" :third="'数据报表'"></bread>
    <!------------------------- 卡片 ------------------------------------>
    <el-card class="box-card" style="margin-top:15px ">
      <div id="main" style="width: 750px;height:400px;"></div>
    </el-card>
  </div>
</template>
           
<script>
import echarts from "echarts";
//合并options
import _ from "lodash";
import { getReports_api } from "@/api/index.js";
export default {
  data() {
    return {
      option: {
        title: {
          text: "用户来源"
        },
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "cross",
            label: {
              backgroundColor: "#6a7985"
            }
          }
        },
        toolbox: {
          feature: {
            saveAsImage: {}
          }
        },
        grid: {
          left: "3%",
          right: "4%",
          bottom: "3%",
          containLabel: true
        },
        xAxis: [
          {
            type: "category",
            boundaryGap: false,
          }
        ],
        yAxis: [
          {
            type: "value"
          }
        ],
      
      }
    };
  },
 async mounted() {
    var myChart = echarts.init(document.getElementById('main'));
    const {data:res}=await getReports_api();
    // console.log(res,33333);
      var result=_.merge(res.data,this.options)
    myChart.setOption(result);
  }
};
</script>
<style scoped>
</style>